@import "../../app.less";

.titleText(@fontSize) {
  font-size: @fontSize;
  font-family: 'ruizizhenyan', sans-serif;
}

/* 神奇代码，隐藏滚动条 */
::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
  color: transparent;
}

.mainBox {
  position: relative;
  height: 100vh;
  // .flexbox(column);
}

@headHeight: 7vh;
.navHead {
  width: 100%;
  height: @headHeight;
  .flexbox(row);
  background-color: #171C34;

  .text {
    font-family: 'ruizizhenyan';
    letter-spacing: 5px;
    font-size: 2.3vh;
    color: white;
  }
}

.backGround {
  position: absolute;
  width: 100%;
  bottom: 15vh;
  scale: 160%;
  opacity: 15%;
  z-index: -10;
}

.nullText {
  color: gray;
  width: 100%;
  text-align: center;
  margin-top: 5vh;
}

.list-content {
  width: 100%;
  flex: 1;
  height: 100vh - 7vh - 14.1vh ;
  margin-left: auto;
  margin-right: auto;
  .flexbox(row);
  align-items: flex-start;
  flex-wrap: wrap;

  .itemBox {
    flex: 0 0 47%;
    height: 30vh;
    margin-bottom: 1vh;
    margin-top: 1vh;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    border-radius: 10px;
    .flexbox(column);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);

    .itemIcon {
      object-fit: cover;
      width: 80%;
      height: 42%;
      border-radius: 4px;
      box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.50);
    }

    .itemTitle {
      .titleText(0.9rem);
      margin: 10px;
    }

    .btnBox {
      .flexbox(row);
      width: 80%;
      justify-content: space-between;

      view {
        border-radius: 12px;
        padding: 7px 10px;
        font-size: 11px;
        font-weight: bold;
        background-color: #EFEFEF;
      }

      .searchBtn {
        background-image: linear-gradient(rgb(235, 255, 0), rgb(198, 255, 0));
      }
    }

    .itemCreateTime {
      font-size: 10px;
      margin-top: 10px;
      color: gray;
    }
  }
}

.only-list {
  .flexbox(row);
  align-items: flex-start;

  .itemBox {
    width: 170px;
  }
}

.tabbar{
  width: 100%;
  height: 9vh;
}